﻿@page "/achievement"
@namespace SwashbucklerDiary.Pages
@inherits PageComponentBase

<MAppBar App="true"
         Elevation="0">
    <MButton Icon="true"
             OnClick="NavigateToBack">
        <MIcon>
            mdi-arrow-left
        </MIcon>
    </MButton>

    <MySearch @bind-Value="ShowSearch"
    @bind-Search="Search"
              Title="@(I18n.T("Mine.Achievement.Name"))"
              OnChanged="UpdateAchievements">
    </MySearch>

    <MButton Icon="true"
             OnClick="()=>ShowSearch=!ShowSearch">
        <MIcon>
            mdi-magnify
        </MIcon>
    </MButton>
</MAppBar>

<ScrollContainer>
    <div class="d-flex justify-space-between flex-wrap">
        @foreach (var item in Achievements)
        {
            <MCard Class="mb-5 my-sm-5 py-sm-3 achievement-card"
                   Elevation="0"
                   Rounded="@("lg")"
                   Ripple="false">
                <MList>
                    <MListItem>
                        <MListItemAvatar>
                            <MIcon XLarge
                                   Color="@GetIconColor(item)">
                                @(AchievementPage.GetIcon(item))
                            </MIcon>
                        </MListItemAvatar>

                        <MListItemContent>
                            <MListItemTitle Class="mb-4 font-weight-bold">
                                @(I18n.T(item.Name))
                            </MListItemTitle>

                            <MListItemSubtitle Class="mb-4">
                                @(I18n.T(item.Description))
                            </MListItemSubtitle>

                            <MProgressLinear Value="AchievementPage.GetProgressRate(item)"
                                             Class="rounded-pill"
                                             Color="@(GetProgressRateColor(item))"
                                             Height="20">
                                <strong class="@GetProgressRateTextColor(item)">
                                    @(GetProgressRateText(item))
                                </strong>
                            </MProgressLinear>
                        </MListItemContent>
                    </MListItem>
                </MList>
            </MCard>
        }
    </div>

    <NotFound Show="!string.IsNullOrEmpty(Search)"></NotFound>
</ScrollContainer>
